<template>
  <TableView
    ref="tableView"
    :table-attrs="{
      api: fetchList,
      descs: ['create_time'],
      dicOptions: [
        { prop: 'monetaryUnit', dicType: 'asset_currency_unit' },
        { prop: 'status', dicType: 'asset_status' },
        { prop: 'source', dicType: 'asset_source' },
        { prop: 'fundsSource', dicType: 'asset_source' },
        { prop: 'purchaseMode', dicType: 'asset_purchase_method' },
        { prop: 'usageOption', dicType: 'asset_how_user' }
      ]
    }"
    form-path="/asset/fyassetassetcard/cardForm/{id:-1}"
    :search-model="searchForm"
    :delete-api="batchDelete"
    :toolbar-attrs="{
      buttons: ['slot', { del: permissions.cord_fyassetassetcard_del, create: permissions.cord_fyassetassetcard_add }]
    }">
    <template #toolbar-button>
      <ToolbarButton
        v-if="permissions.cord_fyassetassetcard_export"
        type="primary"
        icon="el-icon-download"
        label="导出"
        @click="exportExcel()" />
      <ToolbarButton
        v-if="permissions.cord_fyassetassetcard_export"
        type="primary"
        icon="el-icon-upload"
        label="导入"
        @click="$refs.excelUpload.show()" />
    </template>
    <template #columns>
      <TableColumn label="资产状态" prop="status" />
      <TableColumn label="父资产名称" prop="parentName" clickable width="135" />
      <TableColumn label="资产编码" prop="number" width="150" clickable />
      <TableColumn label="资产名称" prop="name" clickable width="110" />
      <TableColumn label="资产类型" prop="ctiName" />
      <TableColumn label="资产别名" prop="alias" />
      <TableColumn label="规格型号" prop="model" width="80" />
      <TableColumn label="SN号" prop="sn" />
      <TableColumn label="计量单位" prop="unit" />
      <TableColumn label="金额" prop="amount" />
      <TableColumn label="使用单位" prop="usedeptFullname" />
      <TableColumn label="使用人" prop="useName" />
      <TableColumn label="存放地点" prop="location" />
      <TableColumn label="购入日期" prop="buyDate" width="90" />
      <TableColumn label="供应商" prop="supplier" />
      <TableColumn label="供应商联系人" prop="supplierUser" width="110" />
      <TableColumn label="供应商联系电话" prop="supplierPhone" width="110" />
      <TableColumn label="使用期限" prop="usefulLife" />
      <TableColumn label="标准型号" prop="sauName" />
      <TableColumn label="英文名称" prop="enName" />
      <TableColumn label="会计凭证号" prop="voucherNo" />
      <TableColumn label="所属单位" prop="belongdeptFullname" />
      <TableColumn label="合同号" prop="contractNumber" />
      <TableColumn label="原值" prop="originalAmount" />
      <TableColumn label="累计折旧" prop="depreciation" />
      <TableColumn label="货币单位" prop="monetaryUnit" />
      <TableColumn label="生产厂" prop="maker" />
      <TableColumn label="品牌" prop="brand" />
      <TableColumn label="维保到期" prop="maintenanceDate" width="90" />
      <TableColumn label="截止日期" prop="guaranteeDate" width="90" />
      <TableColumn label="出厂日期" prop="factoryDate" width="90" />
      <TableColumn label="建档日期" prop="recordDate" width="90" />
      <TableColumn label="取得日期" prop="acquireDate" width="90" />
      <TableColumn label="使用日期" prop="useDate" width="90" />
      <TableColumn label="报废日期" prop="scrapDate" width="90" />
      <TableColumn label="经费来源" prop="fundsSource" />
      <TableColumn label="采购方式" prop="purchaseMode" width="80" />
      <TableColumn label="固定资产" prop="fixedAssets" width="80" align="center">
        <template #default="{ row }">
          <ElTag>{{ row.fixedAssets === '0' ? '否' : '是' }}</ElTag>
        </template>
      </TableColumn>
      <TableColumn label="取得方式" prop="acquireWay" />
      <TableColumn label="功能描述" prop="description" />
      <TableColumn label="备注" prop="remarks" />
    </template>
    <template #search-form>
      <FormInput v-model="searchForm.usefulLife" label="使用限期" prop="usefulLife" />
      <FormInput v-model="searchForm.supplier" label="供应商" prop="supplier" />

      <FormDatePicker v-model="searchForm.buyDate" label="购入日期" :split="false" date-range prop="buyDate" />

      <FormInput v-model="searchForm.location" label="存放地点" prop="location" />
      <FormInput v-model="searchForm.useName" label="使用人" prop="useName" />
      <FormInput v-model="searchForm.usedeptFullname" label="使用单位" prop="usedeptFullname" />
      <FormInput v-model="searchForm.amount" label="金额" prop="amount" />
      <FormInput v-model="searchForm.unit" label="计量单位" prop="unit" />
      <FormInput v-model="searchForm.model" label="规格型号" prop="model" />
      <FormInput v-model="searchForm.ctiName" label="资产分类" prop="ctiName" />
      <FormInput v-model="searchForm.name" label="资产名称" prop="name" />
      <FormInput v-model="searchForm.number" label="资产编码" prop="number" />
      <FormSelect v-model="searchForm.status" label="资产状态" prop="status" dict-type="asset_status" />
      <FormInput v-model="searchForm.belongdeptFullname" label="所属单位" prop="belongdeptFullname" />
    </template>
    <!--excel 模板导入 -->
    <ExcelUpload
      ref="excelUpload"
      title="资产信息导入"
      :url="`${assetService}fyassetassetcard/import`"
      :temp-url="`${assetService}fyassetassetcard/local/assetCardTemp.xlsx`"
      temp-name="资产信息导入模板.xlsx"
      @refreshDataList="refreshChange" />
  </TableView>
</template>

<script>
  import { mapState } from 'vuex'
  import { services } from '@/config'
  import { fetchList, batchDelete } from '@/api/asset/fyassetassetcard'

  export default {
    name: 'CardView',

    data() {
      return {
        searchForm: {
          usefulLife: '',
          supplier: '',
          buyDate: [],
          location: '',
          useName: '',
          amount: '',
          unit: '',
          model: '',
          ctiName: '',
          name: '',
          number: '',
          status: '',
          parentUseunitname: '',
          belongdeptFullname: ''
        },
        assetService: services.assetService
      }
    },
    computed: {
      ...mapState('user', ['permissions'])
    },
    methods: {
      fetchList,
      batchDelete,
      refreshChange() {
        this.$refs.tableView.onSearchClick()
      },
      onNodeClick(node) {
        this.searchForm.year = node.id
        this.$refs.tableView.onSearchClick()
      },
      //  导出excel
      exportExcel() {
        this.$downBlobFile(
          `${services.assetService}fyassetassetcard/export`,
          this.searchForm,
          `资产信息管理${this.$dateFormat(new Date())}.xlsx`
        )
      }
    }
  }
</script>
